<template>
	<view id="rechargeDetail">
		<Header txt="明细" v-if="baidu"></Header>
		<HeaderB txt="明细" v-if="!baidu"></HeaderB>
		<view class="no" v-if="!no">
			<image src="https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/%E5%9B%BE%E6%A0%87/%E6%97%A0%E4%BA%A4%E6%98%93.png" mode="aspectFit"></image>
			<view class="text">
				暂无交易明细
			</view>
		</view>
		<view class="" v-if="no">
			<view class="content" v-for="(item,index) in dataList" :key="index">
				<view class="tit">
					钱包购买订单
					<view class="cost">
						{{item.cost}}
					</view>		
				</view>
				<view class="time">
					{{item.createTime}}
				</view>
			</view>	
		</view>
		
	</view>
</template>

<script>
	import {formatDate2} from "../../common/com.js"
	export default {
		data() {
			return {
				pageNum:1,
				dataList:[],
				baidu:true,
				no:true,
			};
		},
		onShow() {
			this.list()
			// #ifdef MP-BAIDU
			this.baidu=false
			// #endif
		},
		onReachBottom(){
			this.list()
		},
		methods:{
			list(){
				let that = this;
					this.$store
					.dispatch("ListTradeRecord",{pageNum:this.pageNum})
					.then((response) => {
						console.log(response)
						if(response.data.code==0){
							let tar=response.data.obj.list
							 tar.forEach((item) => {
								 item.createTime=formatDate2(item.createTime)
							 })
							 that.dataList=[...that.dataList, ...tar];
							 that.pageNum++;
							 if(response.data.obj.total==0){
								this.no=false
							 }else{
								this.no=true
							 }
						}
					})
			}
		}
	}
</script>

<style lang="less">
#rechargeDetail{
	overflow: hidden;
	.no{
		padding-bottom: 85%;
		padding-top: 45%;
		width: 100%;
		height: 100%;
		text-align: center;
		image{
			width: 280rpx;
			height: 200rpx;
		}
		.text{
			margin-top:10rpx;
			text-align: center;
			height: 28rpx;
			font-size: 28rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #999999;
		}
	}
	.content{
		width: 90%;
		margin: 0 auto;
		border-bottom: 1rpx solid #f6f6f6;
		padding:20rpx 0;
		.tit{
			font-size: 28rpx;
			color: #222222;
			font-weight: bold;
		}
		.cost{
			display: inline-block;
			float: right;
			font-weight: normal;
			color: #ec5728;
		}
		.time{
			font-size: 24rpx;
			color: #999;
			margin-top: 24rpx;
		}
	}
}
</style>
